<template>
    <div class="main-container" id="main-container">
    <div style="background-color: #fff;height:100%;"  id="ProductMasterData"> 
            <a-tabs   :lazy-load="true" type="card"  @change="tabsChange" justify>
                    <a-tab-pane title="验布作业登记" key="1">
                            <div style="height:100%;">
                                <ClothInspection></ClothInspection>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="成检异常登记" key="2">
                            <div style="height:100%;">
                                <AbnormalProductInspection v-if="pageData.fectToday2"></AbnormalProductInspection>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="成品批核" key="3">
                            <div style="height:100%;">
                                <FinishedProductApproval v-if="pageData.fectToday3"></FinishedProductApproval>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="改黑作业" key="4">
                            <div style="height:100%;">
                                <BlackoutOperation v-if="pageData.fectToday4"></BlackoutOperation>
                            </div>
                    </a-tab-pane>
                    <a-tab-pane title="流转卡二维码登记列表" key="5">
                        <div style="height:100%;">
                            <QRCodeRegistration v-if="pageData.fectToday5"></QRCodeRegistration>
                        </div>
                    </a-tab-pane>
                    <a-tab-pane title="标签打印" key="6">
                        <div style="height:100%;">
                            <LabelPrinting v-if="pageData.fectToday6"></LabelPrinting>
                        </div>
                    </a-tab-pane>
                    <a-tab-pane title="外加工标签打印" key="7">
                        <div style="height:100%;">
                            <OutsourcingLabel v-if="pageData.fectToday7"></OutsourcingLabel>
                        </div>
                        </a-tab-pane>
                    <a-tab-pane title="生产进度跟踪" key="8">
                        <div style="height:100%;">
                            <ProductionProgressTracking v-if="pageData.fectToday8"></ProductionProgressTracking>
                        </div>
                    </a-tab-pane>
                    <a-tab-pane title="批色部码卡打印" key="9">
                        <div style="height:100%;">
                            <CodeCardPrinting v-if="pageData.fectToday9"></CodeCardPrinting>
                        </div>
                    </a-tab-pane>
            </a-tabs>
        </div>
   
    </div>
</template>

<script lang="ts">
 
 import { defineComponent,reactive, ref } from 'vue'

import emitter from '@/hooks/useEventBus'
   export default defineComponent({
       name:'FinishedInspectionData',
       setup(){
        
     
       const pageData = reactive({
            tableIndex:"1",
            fectToday2: false,
            fectToday3: false,
            fectToday4: false,
            fectToday5: false,
            fectToday6: false,
            fectToday7: false,
            fectToday8: false,
            fectToday9: false
       })

  
       const tabsChange = (e:string|number)=>{
           pageData.tableIndex = e as string
           let name = 'fectToday' + e
           if (e != '1') {
                pageData[name] = true
            }  
       }
        return{
            pageData,
            tabsChange
        }
       }
   })
</script>
<style scoped>
    .main-container{
        height: 100%;
    }
</style>